<template>
    <div class="error-log">
        <i v-if="errorLogs" class="el-icon-document-copy" @click="handleCopy"></i>
        <p v-if="nodeData.nodeName" class="node-name">「{{nodeData.nodeName}}」节点</p>
        <p>{{errorLogs}}</p>
    </div>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
    name: 'ErrorLog',
    computed: {
        ...mapGetters({
            errorLogs: 'common/getConsoleErrorLogs',
            nodeData: 'common/getNodeData'
        })
    },
    methods: {
        handleCopy () {
            let input = document.createElement('input')
            input.value = this.errorLogs
            document.body.appendChild(input)
            input.select()
            document.execCommand('Copy')
            document.body.removeChild(input)
            this.$message.success('复制成功')
        }
    }
}
</script>
<style lang="less">
    .error-log {
        position: relative;
        p {
            color: #f56c6c;
            margin: 0 0 5px 0;
        }
        .node-name {
            color: initial;
        }
        .el-icon-document-copy {
            position: absolute;
            top: 0px;
            right: 0px;
            cursor: pointer;
            color: #666;
            font-size: 20px;
        }
    }
</style>
